// ----------------------------导入区----------------------------
import {createRouter, createWebHashHistory} from "vue-router";
import Cmp01Looog from "../components/Cmp01Looog.vue";
import Cmp02Tiger from "../components/Cmp02Tiger.vue";
import Cmp03Bird from "../components/Cmp03Bird.vue";
import Cmp04Turtle from "../components/Cmp04Turtle.vue";
import Cmp05Info from "../components/Cmp05Info.vue";

// ----------------------------数据区----------------------------
let router = createRouter({
    history: createWebHashHistory(),
    routes: [
        {
            path: "/", // 访问组件的路径，“/”是默认访问的路径
            component: Cmp01Looog // 具体的一个组件
        },
        {
            path: "/tiger/:tigerName/:tigerAge",
            component: Cmp02Tiger,
            name: "tigerRule" // 给路由规则设定一个名称
        },
        {
            path: "/bird",
            component: Cmp03Bird
        },
        {
            path: "/turtle",
            component: Cmp04Turtle
        },
        {
            path: "/test/redirect",
            redirect: "/bird"
        },
        {
            path: "/info",
            component: Cmp05Info
        }
    ]
});

// 路由守卫
// 前置路由守卫
router.beforeEach((to, from, next) => {
    console.log("[前置路由守卫]来源地址：" + from.path);
    console.log("[前置路由守卫]目标地址：" + to.path);
    console.log("[前置路由守卫]请求参数：" + to.query.message);
    console.log("[前置路由守卫]路径参数：" + to.params.tigerName);

    // 设定一个条件：路径参数 tigerName 值如果等于 jerry 则放行，否则跳转到提示信息的组件
    if (to.path == "/" || to.path == "/info" || to.params.tigerName == "jerry") {
        next();
    } else {
        next("/info");
    }
});

// 后置路由守卫
router.afterEach((to, from, failure) => {
    console.log("[后置路由守卫]来源地址：" + from.path);
    console.log("[后置路由守卫]目标地址：" + to.path);
});

// ----------------------------导出区----------------------------
export default router;